<template>
  <div class="submit-order">
    <div class="content">
      <div class="step-box">
        <div class="left">
          <span class="img"></span>
          <span class="text">{{$t('submitOrder.submitOrder')}}</span>
        </div>
        <div class="steps">
          <div class="item">
            <div class="number">step 01.</div>
            <div class="text">{{$t('submitOrder.selectProductToBuy')}}</div>
          </div>
          <div class="item active">
            <div class="number">step 02.</div>
            <div class="text">{{$t('submitOrder.confirmOrderInformation')}}</div>
          </div>
          <div class="item">
            <div class="number">step 03.</div>
            <div class="text">{{$t('submitOrder.payToCompleteTheOrder')}}</div>
          </div>
        </div>
      </div>
      <div class="submit-con">
        <!-- 收货地址 -->
        <div class="submit-box">
          <div class="tit">
            <span class="text">{{$t('address.receivingAddress')}}</span>
            <!-- <span class="action">显示全部地址</span> -->
          </div>
          <div class="con address-box">
            <div
              :class="[
                'item',
                address.commonAddr ? 'default-address' : '',
                selectedAddrId == address.addrId ? 'active' : ''
              ]"
              v-for="address in addressList"
              :key="address.addrId"
              @click="changeAddress(address.addrId)"
            >
              <div class="name-phone">
                <span class="name">{{ address.receiver }}</span>
                <span class="phone">{{ address.mobile }}</span>
                <span
                  class="set-default"
                  v-if="!address.commonAddr"
                  @click="setDefaultAddr(address.addrId)"
                  >{{$t('address.setDefault')}}</span
                >
                <span class="default-tag" v-if="address.commonAddr">{{$t('address.default')}}</span>
              </div>
              <div class="address-detail">
                {{
                  address.province + address.city + address.area + address.addr
                }}
              </div>
              <div class="del-edit">
                <span
                  class="edit"
                  @click.stop="editAddr(address.addrId)"
                ></span>
                <span
                  class="del"
                  @click.stop="toggleDelAddr(true, address.addrId)"
                ></span>
              </div>
            </div>
            <div class="item add-address" @click="toggleAddrPop(true)" v-if="addressList.length<10">
              <div class="add-box">
                <div class="img">+</div>
                <div class="text">{{$t('address.addAddress')}}</div>
              </div>
            </div>
          </div>
          <div class="popup-mask" v-if="showDelAddr"></div>
          <div class="fix-transform-blur">
            <div class="popup-box" v-if="showDelAddr">
              <div class="tit" style="padding:10px;">
                <div class="text">{{$t('tips')}}</div>
                <div class="close" @click="toggleDelAddr(false)"></div>
              </div>
              <div class="con">
                <div class="tip">
                  <div class="tip-icon warning"></div>
                  <div class="tip-info">
                    <div class="result">{{$t('address.deleteShippingAddress')}}</div>
                    <div class="date">{{$t('address.deleteShippingTips')}}</div>
                    <div class="btns">
                      <a
                        href="javascript:void(0);"
                        @click="delAddr()"
                        class="btn-r"
                        >{{$t('delete')}}</a
                      >
                      <a
                        href="javascript:void(0);"
                        @click="toggleDelAddr(flase)"
                        class="btn-g"
                        >{{$t('cancel')}}</a
                      >
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- 收货地址 -->
        <!-- 支付方式 -->
        <div class="submit-box">
          <div class="tit">
            <span class="text">{{$t('commonFoot.paymentMethod')}}</span>
          </div>
          <div class="con pay-way">
            <div class="item active">{{$t('submitOrder.payOnline')}}</div>
            <!-- <div class="item">货到付款</div>
            <div class="item">线下支付</div>-->
          </div>
        </div>
        <!-- 支付方式 -->
        <!-- 积分抵扣 -->
        <div
          class="submit-box integral-box"
          v-if="orderInfo.maxUsableScore > 0"
        >
          <div class="tit">
            <span class="text">{{$t('submitOrder.pointsCredit')}}</span>
          </div>
          <!-- 积分抵现 -->
          <div class="integral-item">
            <label class="text">
              <el-checkbox
                v-model="checked"
                :disabled="isProhibit"
                class="item-group"
                @change="useMemberPoints"
              ></el-checkbox
              >{{$t('submitOrder.usePointsForCrediting')}}
            </label>
            <div class="con"></div>
          </div>
          <!-- 积分抵现 -->
          <div class="integral-item integral-input-box" v-if="isScorePay == 1">
            {{$t('submitOrder.accountTotal')}} {{ accountCanUseScore }}{{$t('submitOrder.pointThisUse')}}
            <input
              type="number"
              v-model="userUseScore"
              class="text"
              @input="inputComplete()"
            />
              <!-- @input="inputComplete()" -->
            {{$t('submitOrder.pcsCredit')}}
            <span class="integral-money">
              ￥{{
                userUseScore
                  ? Number(orderInfo.totalScoreAmount).toFixed(2)
                  : '0.00'
              }}
            </span>
            <span>
              （{{$t('submitOrder.theOrderIsAvailableUpTo')}} {{ orderInfo.maxUsableScore }} {{$t('submitOrder.points')}}）
              <span v-if="shopUseScore > 100">{{($t('submitOrder.pleaseEnterAMultipleOf10'))}}</span>
            </span>
          </div>
          <div class="integral-item integral-text" v-if="isScorePay == 1">
            <span class="font-bold">
              {{$t('submitOrder.amountCredit')}}
              <span class="integral-money">
                ￥{{
                  userUseScore
                    ? Number(orderInfo.totalScoreAmount).toFixed(2)
                    : '0.00'
                }}
              </span>
            </span>
            <span class="text-item font-gray">
              {{$t('submitOrder.use')}}￥
              {{
                userUseScore
                  ? Number(orderInfo.totalScoreAmount).toFixed(2)
                  : '0.00'
              }}
            </span>
          </div>
        </div>
        <!-- 积分抵扣 -->
        <!-- 配送方式 -->
        <div class="submit-box">
          <div class="tit">
            <span class="text">{{$t('submitOrder.deliveryMethod')}}</span>
          </div>
          <div class="con delivery-way">
            <div class="item active">{{$t('submitOrder.courierDelivery')}}</div>
            <!-- <div class="item">到店自提</div> -->
            <!-- <div class="description">（该商品不支持自提）</div> -->
          </div>
        </div>
        <!-- /配送方式 -->
        <!-- 商品信息 -->
        <div class="submit-box goods-info">
          <div class="tit">
            <span class="text">{{$t('applyReturn.productInformation')}}</span>
          </div>
          <div class="goods-msg">
            <div class="msg-tab">
              <div class="img">&nbsp;</div>
              <div class="info">{{$t('products')}}</div>
              <div class="unit-price">{{$t('priceOne')}}</div>
              <div class="number">{{$t('quantity')}}</div>
              <div class="total">{{$t('subtotal')}}</div>
            </div>
            <div
              class="msg-con"
              v-for="(shopCart, index) in shopCartOrders"
              :key="shopCart.shopId"
            >
              <!-- 店铺 -->
              <div class="shop-msg">
                {{$t('index.shop')}}：
                <a
                  :href="'/shopIndex?sid=' + shopCart.shopId"
                  class="shop-name"
                  >{{ shopCart.shopName }}</a
                >
                <span class="self" v-if="shopCart.shopId == 1">{{$t('prodDetail.selfEmployed')}}</span>
              </div>
              <!-- 店铺中的商品 -->
              <div
                class
                v-for="(shopCartItemDiscount,
                index) in shopCart.shopCartItemDiscounts"
                :key="index"
              >
                <div
                  class="goods-box"
                  v-for="(prod,
                  prodIndex) in shopCartItemDiscount.shopCartItems"
                  :key="prodIndex"
                >
                  <div class="img">
                    <a :href="'/detail/' + prod.prodId" class="img-box">
                      <img :src="prod.pic" alt />
                    </a>
                  </div>
                  <div class="info">
                    <a :href="'/detail/' + prod.prodId" class="name">{{
                      prod.prodName
                    }}</a>
                    <span class="sku">{{ prod.skuName }}</span>
                  </div>
                  <div class="unit-price">
                    ￥{{ parsePrice(prod.price)[0] }}.{{
                      parsePrice(prod.price)[1]
                    }}
                  </div>
                  <div class="number">×{{ prod.prodCount }}</div>
                  <div class="total">
                    ￥{{ parsePrice(prod.productTotalAmount)[0] }}.{{
                      parsePrice(prod.productTotalAmount)[1]
                    }}
                  </div>
                </div>
              </div>

              <!-- 留言 -->
              <div class="remake-box">
                {{$t('submitOrder.messageToMerchant')}}：
                <input
                  type="text"
                  class="text"
                  v-model="shopCart.remarks"
                  maxlength="100"
                  :data-shopinde="index"
                  :data-shopitem="shopCart"
                  :placeholder="$t('submitOrder.numberLength100')"
                />
              </div>
              <!-- /留言 -->

              <!-- 优惠券选择框 -->
              <coupon-select
                :coupons="shopCart.shopCoupons"
                @checkCoupon="checkCoupon"
                v-if="
                  shopCart.shopCoupons &&
                    shopCart.shopCoupons.canUseCoupons.length > 0
                "
              ></coupon-select>
              <!-- 优惠券选择框 -->
            </div>
          </div>
        </div>
        <!-- 商品信息 -->
        <!-- 发票信息 -->
        <!-- <div class="submit-box">
          <div class="tit">
            <span class="text">发票信息</span>
          </div>
          <div class="con invoice-msg">
            <div class="invoice-text">电子普通发票</div>
            <div class="invoice-text">个人</div>
            <div class="invoice-text">商品明细</div>
            <a href=""
               class="invoice-btn">修改</a>
          </div>
        </div>-->
        <!-- /发票信息 -->
        <!-- 优惠券选择框 -->
        <div
          class="submit-box"
          v-if="platformCoupons && platformCoupons.canUseCoupons.length > 0"
        >
          <div class="tit">
            <span class="text">{{$t('submitOrder.platformCoupons')}}</span>
          </div>
          <coupon-select
            :coupons="platformCoupons"
            :platform="true"
            @checkCoupon="checkCoupon"
          ></coupon-select>
        </div>
      </div>
      <div class="submit-bottom">
        <div class="statistic-box">
          <div class="item">
            <div class="tit">
              <span class="number">{{ orderInfo.totalCount }}</span
              >{{$t('submitOrder.totalItems')}}：
            </div>
            <div class="con">
              ￥{{ parsePrice(orderInfo.total)[0] }}.{{
                parsePrice(orderInfo.total)[1]
              }}
            </div>
          </div>
          <div class="item">
            <div class="tit">{{$t('submitOrder.freightPayable')}}：</div>
            <div class="con">
              <p>
              +￥{{ parsePrice(orderInfo.totalTransfee)[0] }}.{{
                parsePrice(orderInfo.totalTransfee)[1]
              }}
              </p>
              <p v-if="orderInfo.freeTransfee > 0">
                ({{$t('submitOrder.membershipReductions')}}：-￥{{ parsePrice(orderInfo.freeTransfee)[0] }}.{{
                  parsePrice(orderInfo.freeTransfee)[1]
                }})
              </p>
            </div>
          </div>
          <div
            class="item"
            v-if="shopCartOrders[0] && shopCartOrders[0].discountReduce"
          >
            <div class="tit">{{$t('submitOrder.promotionalSale')}}：</div>
            <div class="con">
              -￥{{ parsePrice(shopCartOrders[0].discountReduce)[0] }}.{{
                parsePrice(shopCartOrders[0].discountReduce)[1]
              }}
            </div>
          </div>
          <div class="item" v-if="orderInfo.totalLevelAmount">
            <div class="tit">{{$t('submitOrder.memberDiscount')}}：</div>
            <div class="con">
              -￥{{ parsePrice(orderInfo.totalLevelAmount)[0] }}.{{
                parsePrice(orderInfo.totalLevelAmount)[1]
              }}
            </div>
          </div>
          <div class="item">
            <div class="tit">{{$t('submitOrder.totalOffer')}}：</div>
            <div class="con">
              -￥{{ parsePrice(orderInfo.orderReduce)[0] }}.{{
                parsePrice(orderInfo.orderReduce)[1]
              }}
            </div>
          </div>
          <div class="item" v-if="isScorePay == 1">
            <div class="tit red-font">{{$t('submitOrder.pointsCredit')}}：</div>
            <div class="con">
              -￥{{ parsePrice(orderInfo.totalScoreAmount)[0] }}.{{
                parsePrice(orderInfo.totalScoreAmount)[1]
              }}
            </div>
          </div>
        </div>

        <div class="detail-box">
          <div class="item">
            <div class="tit">{{$t('submitOrder.totalPayable')}}：</div>
            <div class="con">
              ￥{{ parsePrice(orderInfo.actualTotal)[0] }}.{{
                parsePrice(orderInfo.actualTotal)[1]
              }}
            </div>
          </div>
          <div class="item" v-if="currentAddr.addrId">
            <span class="text">
              {{$t('submitOrder.sendTo')}}：{{
                currentAddr.province +
                  ' ' +
                  currentAddr.city +
                  ' ' +
                  currentAddr.area +
                  ' ' +
                  currentAddr.addr
              }}
            </span>
            <span class="text"
              >{{$t('submitOrder.consignee')}}：{{ currentAddr.receiver }} {{ currentAddr.mobile }}</span
            >
          </div>
        </div>
        <div class="btn-box">
          <a href="javascript:void(0)" class="btn" @click="submitOrder"
            >{{$t('submitOrder.submitOrder')}}</a
          >
        </div>
      </div>
    </div>
    <!-- 地址弹窗 -->
    <AddressPop
      :editAddrId="editAddrId"
      v-if="showAddrPop"
      @getAddrList="getAddrList"
      @reloadOrderInfo="loadOrderInfo"
      @toggleAddrPop="toggleAddrPop"
    />
    <!-- /地址弹窗 -->
  </div>
</template>

<script>
import Cookie from 'js-cookie'
import bus from '~/plugins/bus'
import AddressPop from '~/components/add-or-edit-address'
import CouponSelect from '~/components/coupon-select'
import { _debounce } from "~/plugins/util";   //防抖

export default {
  components: {
    AddressPop,
    CouponSelect
  },
  data () {
    return {
      addressList: [],
      selectedAddrId: 0,
      orderInfo: {},
      shopCartOrders: [],
      currentAddr: {}, // 当前选择的地址
      couponIds: [],
      userChangeCoupon: 0, // 用户有没有对优惠券进行改变
      coupons: {
        totalLength: 0,
        canUseCoupons: [],
        unCanUseCoupons: []
      },
      totalScoreAmount: 0, // 积分抵扣金额
      totalUsableScore: 0, // 整个订单可以使用的积分数
      isScorePay: 0, // 用户是否选择积分抵现(0不使用 1使用 默认不使用)
      isChecked: true, // 是否选择会员积分抵现
      isProhibit: false, // （积分抵现）checkbox是否禁止
      showAddrPop: false, // 地址弹窗显隐

      // 地址数据
      editAddrId: 0, // 要修改的地址id
      showDelAddr: false,

      // 券
      showCanUse: true,
      orderEntry: 0, //订单入口 0购物车 1立即购买
      platformCoupons: {
        canUseCoupons: [],
        unCanUseCoupons: []
      },
      uuid: '',
      checked: false, //积分抵现选框
      userUseScore: '', // 使用多少积分抵扣
      accountCanUseScore: 0, // 账号可用积分
      maxUsableScore: 0,
      shopUseScore: '', // 积分抵扣比例
    }
  },
  mounted () {
    document.title = this.$t('submitOrder.submitOrder')
    //获取当前账号可用积分
    this.$axios.get('/p/score/scoreLevel/page?levelType=' + 0).then(({ data }) => {
      this.accountCanUseScore = data.score
    })
    if (this.$route.query.orderEntry) {
      this.orderEntry = this.$route.query.orderEntry
    }
    this.uuid = this.genUUID()
    this.getAddrList()
    this.loadOrderInfo(true)
  },
  watch: {
    maxUsableScore (nv) {
      if (this.userUseScore > nv) {
        this.userUseScore = nv
      }
    }
  },
  methods: {
    /**
     * 积分输入
     */
    inputComplete: _debounce(function () {
      var userUseScore = this.userUseScore;
      userUseScore = userUseScore.replace(/[^\d]/g, ''); // 清除“数字”和“.”以外的字符
      if (userUseScore.indexOf('.') < 0 && userUseScore != '') {
        // 以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
        userUseScore = parseInt(userUseScore);
      }
      this.userUseScore = userUseScore;
      if (this.shopUseScore > 100) {
        this.userUseScore = this.userUseScore - this.userUseScore % 10
      }
      if (this.userUseScore > this.maxUsableScore) {
        this.userUseScore = this.maxUsableScore
      }
      this.loadOrderInfo()
    },500),

    /**
     * 获取地址列表
     */
    getAddrList () {
      this.$axios.get('/p/address/list').then(({ data }) => {
        this.addressList = data
      })
    },

    /**
     * 选择地址
     */
    changeAddress (addrId) {
      this.addressList.forEach(element => {
        if (element.addrId == addrId) {
          this.currentAddr = element
        }
      })
      this.selectedAddrId = addrId
      this.loadOrderInfo()
    },

    /**
     * 改变优惠券选择
     */
    checkCoupon () {
      var couponIds = []
      var shopCartOrders = this.shopCartOrders
      shopCartOrders.forEach(shopCart => {
        if (shopCart.shopCoupons) {
          shopCart.shopCoupons.canUseCoupons.forEach(coupon => {
            if (coupon.choose) {
              couponIds.push(coupon.couponId)
            }
          })
        }
      })
      if (this.platformCoupons && this.platformCoupons.canUseCoupons.length) {
        this.platformCoupons.canUseCoupons.forEach(coupon => {
          if (coupon.choose) {
            couponIds.push(coupon.couponId)
          }
        })
      }
      this.couponIds = couponIds
      this.userChangeCoupon = 1
      this.loadOrderInfo()
    },

    /**
     * 设置为默认地址
     */
    setDefaultAddr (addrId) {
      this.$axios.put('/p/address/defaultAddr/' + addrId).then(({ data }) => {
        this.$message({
          message: data,
          type: 'success',
          duration: 1000
        })
        this.getAddrList()
      })
    },
    /**
     * 显示/隐藏确认删除弹窗
     */
    toggleDelAddr (sts, addrId) {
      this.showDelAddr = sts
      this.editAddrId = addrId
    },
    /**
     * 显示/隐藏地址弹窗
     */
    toggleAddrPop (sts) {
      if (Cookie.get('token')) {
        this.showAddrPop = sts
        this.editAddrId = 0
      } else {
        bus.$emit("showLogin", true)
        this.showAddrPop = false
      }
    },

    /**
     * 修改地址 (弹窗传地址id)
     */
    editAddr (addrId) {
      if (Cookie.get('token')) {
        this.showAddrPop = true
        this.editAddrId = addrId
      } else {
        bus.$emit("showLogin", true)
        this.showAddrPop = false
      }
    },
    /**
     * 删除地址
     */
    delAddr () {
      let reload = false
      if (this.selectedAddrId == this.editAddrId) {
        this.selectedAddrId = 0
        reload = true
      }
      this.$axios
        .delete('/p/address/deleteAddr/' + this.editAddrId)
        .then(({ data }) => {
          this.$message({
            message: data,
            type: 'success',
            duration: 1000
          })
          this.toggleDelAddr(false)
          this.getAddrList()
          if (reload) {
            this.loadOrderInfo()
          }
        })
    },
    /**
     * 价格处理
     */
    parsePrice: value => {
      var val = Number(value)
      if (!val) {
        val = 0
      }
      // 截取小数点后两位，并以小数点为切割点将val转化为数组
      return val.toFixed(2).split('.')
    },

    /**
     * 积分抵现选择
     */
    useMemberPoints() {
      this.userUseScore = ''
      var checked = !this.checked
      this.checked = !checked
      if (this.orderInfo.maxUsableScore > 0) {
        //maxUsableScore 整个订单可以使用的积分数
        this.isProhibit = false //（积分抵现）checkbox是否禁止
        // 如果积分可抵扣
        if (this.checked) {
          this.isScorePay = 1 //用户是否选择积分抵现(0不使用 1使用 默认不使用)
        } else if (!this.checked) {
          this.isScorePay = 0 //用户是否选择积分抵现(0不使用 1使用 默认不使用)
        }
        setTimeout(() => {
          this.loadOrderInfo() //加载订单数据
        },800)
      } else if (this.orderInfo.maxUsableScore <= 0) {
        this.isProhibit = true //（积分抵现）checkbox是否禁止
      }
    },

    /**
     * 加载订单数据
     */
    loadOrderInfo (isFirst) {
      // const loading = this.$loading({
      //   lock: true,
      //   text: '加载中...',
      //   background: 'rgba(255, 255, 255, 0.8)
      // });
      var orderParam = {
        addrId: this.selectedAddrId,
        orderItem:
          this.orderEntry == 1
            ? JSON.parse(sessionStorage.getItem('orderItem'))
            : undefined,
        basketIds:
          this.orderEntry == 0
            ? JSON.parse(sessionStorage.getItem('basketIds'))
            : undefined,
        couponIds: this.couponIds,
        isScorePay: this.isScorePay,
        userChangeCoupon: this.userChangeCoupon,
        userUseScore: Number(this.userUseScore),
        uuid: this.uuid
      }
      this.$axios
        .post('/p/order/confirm', orderParam)
        .then(({ data }) => {
          var remarksList = []
          if (!isFirst) {
            this.shopCartOrders.forEach(el => {
              remarksList.push(el.remarks)
            })
          }
          var couponIds = []
          this.orderInfo = data
          this.maxUsableScore = data.maxUsableScore  // 订单最大可用积分数量
          if (data.userAddr) {
            this.currentAddr = data.userAddr
            this.selectedAddrId = data.userAddr.addrId
          }
          var shopCartOrders = data.shopCartOrders
          shopCartOrders.forEach((shopCart, index) => {
            if (isFirst) {
              shopCart.remarks = ''
            } else {
              shopCart[index].remarks = remarksList[index]
            }
            shopCart.shopCoupons = this.splitCouponAndPushCouponIds(
              shopCart.coupons,
              couponIds
            )
          })
          this.platformCoupons = this.splitCouponAndPushCouponIds(
            data.coupons,
            couponIds
          ) //平台优惠券
          this.shopCartOrders = shopCartOrders
          this.couponIds = couponIds
          this.shopUseScore = shopUseScore // 积分抵扣比例
        })
        .catch(() => {
          // loading.close();
        })
    },
    /**
     * 分割优惠券成
     * 1. canUseCoupons 可使用优惠券列表
     * 2. unCanUseCoupons 不可使用优惠券列表
     * 3. couponAmount 选中的优惠券可优惠金额
     * 4. 将选中的优惠券ids保存起来
     * @param {*} coupons 优惠券列表
     * @param {*} couponIds 选中的优惠券id
     */
    splitCouponAndPushCouponIds (coupons, couponIds) {
      if (!coupons || !coupons.length) {
        return
      }
      let canUseCoupons = []
      let unCanUseCoupons = []
      let couponAmount = 0
      coupons.forEach(coupon => {
        if (coupon.canUse) {
          canUseCoupons.push(coupon)
        } else {
          unCanUseCoupons.push(coupon)
        }
        if (coupon.choose) {
          couponIds.push(coupon.couponId)
          couponAmount = coupon.reduceAmount
        }
      })
      return {
        canUseLength: canUseCoupons.length,
        couponAmount: couponAmount,
        canUseCoupons: canUseCoupons,
        unCanUseCoupons: unCanUseCoupons
      }
    },
    /**
     * 提交订单
     */
    submitOrder () {
      var shopCartOrders = this.shopCartOrders
      var orderShopParam = []
      shopCartOrders.forEach(shopCart => {
        orderShopParam.push({
          remarks: shopCart.remarks,
          shopId: shopCart.shopId
        })
      })
      if (!this.addressList.length) {
        if (Cookie.get('token')) {
          this.$message({
            message: this.$t('submitOrder.pleaseAddTheAddressFirst'),
            type: 'success',
            duration: 1000
          })
          this.showAddrPop = true
        } else {
          bus.$emit("showLogin", true)
          this.showAddrPop = false
        }
        return
      }
      if (this.selectedAddrId == 0) {
        this.$message({
          message: this.$t('submitOrder.pleaseSelectTheAddressFirst'),
          type: 'success',
          duration: 1000
        })
        document.body.scrollTop = document.documentElement.scrollTop = 0
        return
      }
      if (this.checked && !this.userUseScore) {
        this.$message({
          message: this.$t('submitOrder.pleaseEnterTheNumberOfPoints'),
          type: 'warning',
          duration: 1000
        })
        return
      }
      this.$axios
        .post('/p/order/submit', {
          orderShopParam: orderShopParam,
          uuid: this.uuid
        })
        .then(({ data }) => {
          sessionStorage.setItem('pay_total', this.orderInfo.actualTotal)
          sessionStorage.setItem('pay_orderNumber', data.orderNumbers)
          this.$router.push({
            path: '/payment'
          })
          this.getCartCount()
        })
    },

    /**
     * 获取购物车商品总数
     */
    getCartCount () {
      this.$axios.get('/p/shopCart/prodCount').then(({ data }) => {
        this.$store.commit('cartNumber/changeCartNumber', data)
      })
    },

    /**
     * 生成uuid
     */
    genUUID () {
      var s = []
      var hexDigits = '0123456789abcdef'
      for (var i = 0; i < 36; i++) {
        s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1)
      }
      s[14] = '4' // bits 12-15 of the time_hi_and_version field to 0010
      s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1) // bits 6-7 of the clock_seq_hi_and_reserved to 01
      s[8] = s[13] = s[18] = s[23] = '-'

      var uuid = s.join('')
      return uuid
    }
  }
}
</script>

<style scoped src="~/assets/css/submit-order.css"></style>
<style scoped>
.fix-transform-blur {
  z-index: 10000;
  position: fixed;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -40%);
}

.submit-order .statistic-box .item .tit {
  display: flex;
  justify-content: flex-end;
}

.submit-order .statistic-box .item .tit .text {
  margin-left: 5px;
}
</style>
